<%--
  Created by IntelliJ IDEA.
  User: cos
  Date: 2021/11/18
  Time: 15:25
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>
<body>
<form action="/emp/login" method="post" id="loginForm">
    用户名: <input type="text" name="ename"> <br>
    密码: <input type="password" name="pwd"> <br>
    手机号: <input type="text" id="phone" name="phone"> &nbsp;
    <button type="button" id="sendCode">点击发送验证码</button>
    <br>
    验证码: <input type="text" id="code" name="code"> <br>
    <input type="button" value="登录" id="sub" disabled> <span id="msg"></span> <br>
</form>
<script>
    var timer;
    var num = 60;
    /* 加载函数 */
    $(function () {
        $("#sub").click(function () {
                let data = $("#loginForm").serialize();
                $.ajax({
                    url:"/emp/login",
                    data:data,
                    success:function (result) {
                        if (result=="0") {
                            //js 重定向条件
                            location.href="/emp/index";
                        }else{
                            $("#msg").text("用户名,密码或您的脑子有误,请重新再试").css("color","red");
                        }
                    }
                })
        })


        $("#code").change(function () {
            $.ajax({
                url: "/sys/checkCode?code=" + $("#code").val(),
                success: function (result) {
                    if (result == "0") {
                        $("#sub").prop("disabled",false);
                        $("#msg").text("验证码验证^_^").css("color","green");
                    }else{
                        $("#sub").prop("disabled",true);
                        $("#msg").text("验证码验证T_T").css("color","red");
                    }
                }
            })
        })
        $("#sendCode").click(function () {
            $.ajax({
                url: "/sys/getCode?phone=" + $("#phone").val(),
                success: function (result) {
                    if (result == "0") {
                        $("#sendCode").prop("disabled", true);
                        timer = setInterval(countDown, "1000");
                    } else {
                        $("#msg").text("验证码发送失败");
                    }
                }
            })
        })
    })

    function countDown() {
        num--;
        if (num != 0) {
            $("#sendCode").text("已发送:" + num);
            // $("#sendCode").val(num);
        } else {
            clearInterval(timer);
            // $("#sendCode").removeAttribute("disabled");
            $("#sendCode").prop("disabled", false);
            $("#sendCode").text("发送验证码");
            num = 60;
        }
    }
</script>
</body>
</html>
